<template>
  <view class="container">

    <picker mode="selector" :range="brands" @change="onBrandChange">
      <view class="form-item">
        <text>品牌：</text>
        <text class="value">{{selectedBrand}}</text>
        <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
      </view>
    </picker>

    <picker mode="selector" :range="years" @change="onYearChange">
      <view class="form-item">
        <text>车龄：</text>
        <text class="value">{{selectedYear}}年</text>
        <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
      </view>
    </picker>

    <picker mode="selector" :range="currents" @change="onCurrentChange">
      <view class="form-item">
        <text>电池电流：</text>
        <text class="value">{{selectedCurrent}}A</text>
        <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
      </view>
    </picker>

    <picker mode="selector" :range="voltages" @change="onVoltageChange">
      <view class="form-item">
        <text>电池电压：</text>
        <text class="value">{{selectedVoltage}}V</text>
        <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
      </view>
    </picker>

    <view class="form-item">
      <text>上传图片</text>
      <uni-file-picker
        limit="1"
        fileMediatype="image"
        @select="onFileSelect"
      ></uni-file-picker>
    </view>

    <button @click="onEstimate">立即估价</button>

    <view class="result" v-if="price">
      估价结果：{{ price }} 元
    </view>
  </view>
</template>

<script setup>
import { ref } from 'vue'

import electricVehicleConstants from '@/utils/electric-vehicle-constants.json'

const brands = ref(electricVehicleConstants.brands)
const currents = ref(electricVehicleConstants.currents)
const voltages = ref(electricVehicleConstants.voltages)
const years = ref(electricVehicleConstants.years)

const selectedBrand = ref('')
const selectedYear = ref('')
const selectedCurrent = ref('')
const selectedVoltage = ref('')
const price = ref(null)

const onBrandChange = (e) => {
  selectedBrand.value = brands.value[e.detail.value]
}

const onCurrentChange = (e) => {
  selectedCurrent.value = currents.value[e.detail.value]
}

const onVoltageChange = (e) => {
  selectedVoltage.value = voltages.value[e.detail.value]
}

const onYearChange = (e) => {
  selectedYear.value = years.value[e.detail.value]
}

const onFileSelect = (e) => {
  console.log('Selected file:', e.tempFilePaths[0])
}

const onEstimate = () => {
  if (!selectedBrand.value || !selectedYear.value || !selectedCurrent.value || !selectedVoltage.value) {
    uni.showToast({
      title: '请填写完整信息',
      icon: 'none'
    })
    return
  }

  // 简单随机估价逻辑
  const basePrice = 1000
  const brandFactor = brands.value.indexOf(selectedBrand.value) * 200
  const yearFactor = Math.max(0, 5 - selectedYear.value) * 100
  const currentFactor = currents.value.indexOf(selectedCurrent.value) * 150
  const voltageFactor = voltages.value.indexOf(selectedVoltage.value) * 300
  
  price.value = basePrice + brandFactor + yearFactor + currentFactor + voltageFactor
}
</script>

<style lang="scss">
@use './buy.scss' as *;
</style>
